<template>
	<div class="real-time-datas uv-flex-row" v-if="typing.time>0">
		<span>准确率 {{successRate}}%</span>
		<span v-if="typing.type == 'BASE' || typing.type == 'BOTH'">按键速度 {{typing.kpm}}键/分钟</span>
		<span v-if="typing.type == 'BOTH' || typing.type == 'CNCOPY'">打字速度 {{typing.wpm}}字/分钟</span>
		<span v-if="typing.type == 'ENCOPY'">打字速度 {{typing.wpm}}词/分钟</span>
		<span>用时 {{typing.time}}秒</span>
		<span>进度 {{percentage}}%</span>
	</div>
</template>
<script setup>
	defineProps({
		typing: {
			type: Object,
			default () {
				return {}
			}
		},
		successRate: {
			type: Number,
			default: 0
		},
		percentage: {
			type: Number,
			default: 0
		}
	})
</script>
<style scoped lang="scss">
	.real-time-datas {
		height: 50px;
		justify-content: flex-end;
		align-items: flex-end;
		span {
			margin: 0 10px;
			font-size: 20px;
			color: #7f8596;
		}
	}
</style>